<template>
	<view class="forget">
		<view class="content">
			<!-- 主体 -->
			<view class="main">
				<view class="tips">若你忘记了密码，可在此重置新密码。</view>
				<wInput v-model="phoneData" type="text" maxlength="11" placeholder="请输入手机号码"></wInput>
				<wInput v-model="passData" type="password" maxlength="11" placeholder="请输入新密码" isShowPass></wInput>

				<wInput
					v-model="verCode"
					type="number"
					maxlength="6"
					placeholder="验证码"
					isShowCode
					codeText="获取验证码"
					setTime="30"
					ref="runCode"
					@setCode="getVerCode()"
				></wInput>
			</view>

			<wButton text="重置密码" :rotate="isRotate" @click.native="startRePass()"></wButton>
		</view>
	</view>
</template>

<script>
var _this;
import wInput from '../../components/watch-login/watch-input.vue'; //input
import wButton from '../../components/watch-login/watch-button.vue'; //button
export default {
	data() {
		return {
			phoneData: '321071784@qq.com', // 用户/电话
			passData: '', //密码
			verCode: '', //验证码
			isRotate: false //是否加载旋转
		};
	},
	components: {
		wInput,
		wButton
	},
	mounted() {
		_this = this;
	},
	methods: {
	async	getVerCode() {
			//获取验证码
	
			if (_this.phoneData.length >= 11 && _this.phoneData.length <= 30) {
				const reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
				if (reg.test(this.phoneData)) {
					this.$refs.runCode.$emit('runCode'); //触发倒计时（一般用于请求成功验证码后调用）
					uni.showToast({
						icon: 'none',
						position: 'bottom',
						title: '验证码获取成功'
					});
				} else {
					this.$refs.runCode.$emit('runCode'); //触发倒计时（一般用于请求成功验证码后调用）
					uni.showToast({
						icon: 'none',
						position: 'bottom',
						title: '邮箱不正确'
					});
				}
			}
			const res = await  this.http(this.api.securityCode, {
				uerMail: this.phoneData
			});
		},
	async	startRePass() {
			//重置密码
			if (this.isRotate) {
				//判断是否加载中，避免重复点击请求
				return false;
			}
			if (this.phoneData.length >= 11 && this.phoneData.length <= 30) {
				const reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;
				if (reg.test(this.phoneData)) {
					const res = await this.http(this.api.getThePwdBack, 'getThePwdBack', {
						uerMail: this.phoneData,
						uerPwd:this.passData,
						verCode:this.verCode,
					});
				} else {
					uni.showToast({
						icon: 'none',
						position: 'bottom',
						title: '邮箱格式不正确'
					});
				}
			
				return false;
			}

		}
	}
};
</script>

<style>
@import url('../../components/watch-login/css/icon.css');
@import url('./css/main.css');
</style>
